<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>盒子模型</title>
		<style>
			/* 盒子模型四个元素:content内容/padding内边距/border边框/margin外边框 */
			.box{
				 width:200px; /* 宽 */
				height:300px;/* 高 */
				/* border-width:1px; *//* 边框宽度 */
				/* border-color:red; *//* 边框颜色:颜色单词，#6位十六进制 ,rgb(三个值，每个值0~255)*/
				/* border-style:solid; *//* 边框样式:solid实线  dotted点线   dashed虚线 */
				/* 边框符合写法: */
				border:solid 1px rgb(168,62,177);
				border-bottom:10PX dotted red;
				border-top:10px dashed green;
				border-right:5px solid pink;
				border-left:5px solid gold;
			/* 	方位词:top上,bottom下,left左,right右,center中间 */
			/* padding-top:50px;
			padding-left:30px; */
			/* 复合写法 */
			/* padding:10px;四个方向的内边距都是10px */
			/* padding:10px 30px;  第一个值指上下,第二个值指左右 */
			/* padding:10px 20px 30px;第一个值指上,第二个值左右,第三个值指下 */
			/* padding:10px 20px 30px 40px;第一个值指上,第二个值指右,第三个值指下,第四个值指左(上 右 下 左) */
			/* ctrl+z  撤销 */
			}
		</style>
		
	</head>
	<body>
		<div class="box">hello box</div>
		
		
		
		
	</body>
</html>
